$(function () {
    $("#jqGrid").jqGrid({
        url: baseURL + 'waterself/prodataanalysesubself/list',
        datatype: "json",
        postData:{
            'proName':vm.q.dept,
            'beforeDate':vm.q.date1,
            'afterDate':vm.q.date2,
            'clientId':vm.q.cid,
            'clientName':vm.q.cname,
            'ftype':vm.q.ftype,
        },
        colModel: [
            { label: '设备号', name: 'deviceId', index: 'device_id', width: 120, key: true },
			{ label: '表卡编号', name: 'clientId', index: 'client_id', width: 100 },
			{ label: '客户姓名', name: 'clientName', index: 'client_name', width: 100 },
			{ label: '客户地址', name: 'clientAddress', index: 'client_address', width: 150 },

			{ label: '设备地址', name: 'deviceAddress', index: 'device_address', width: 120
                ,formatter: function(value, options, row){
                    if (value == null) return "";
                    var dev = value.split("-");
                    var cellvalue = dev[dev.length-2]+'-'+dev[dev.length-1];
                    var memo1 = row.proName;
                    if (!(memo1.indexOf('CAT')>=0 || memo1.indexOf('NB')>=0 || memo1.indexOf('CCE')>=0
                        || memo1.indexOf('别墅')>=0 || memo1.indexOf('网点')>=0)){
                        cellvalue = dev[0]+'-'+dev[1]+'-'+dev[2]+'-'+cellvalue;
                    }
                    return cellvalue;
                }
            },
			{ label: '采集方式', name: 'deviceTypeName', index: 'device_type_name', width: 100 },

			{ label: '用量', name: 'useData', index: 'use_data', width: 60 },
			{ label: '上次数据', name: 'beforeData', index: 'before_data', width: 60 },
            { label: '本次数据', name: 'afterData', index: 'after_data', width: 60 },

			{ label: '上次日期', name: 'beforeDate', index: 'before_date', width: 110 },
            { label: '本次日期', name: 'afterDate', index: 'after_date', width: 110 },

			{ label: '上次状态', name: 'beforeStatus', index: 'before_status', width: 60 },
			{ label: '本次状态', name: 'afterStatus', index: 'after_status', width: 60 },

            { label: '表盘号', name: 'plateno', index: 'plateno', width: 80 },
            { label: '表封号', name: 'stampno', index: 'stampno', width: 80 },

			{ label: '小区名称', name: 'proName', index: 'pro_name', width: 80,hidden:true }
        ],
		viewrecords: true,
        height: window.innerHeight-195 > 385 ? window.innerHeight-195 : 385,
        rowNum: 100,
		rowList : [10,30,50,100],
        rownumbers: true, 
        /*rownumWidth: 60,*/
        autowidth:true,
        shrinkToFit:true,
        multiselect: true,
        footerrow: true,
        pager: "#jqGridPager",
        jsonReader : {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        prmNames : {
            page:"page", 
            rows:"limit", 
            order: "order"
        },
        ondblClickRow: function(rowid, iRow, iCol, e){
            $("#jqGrid").jqGrid('resetSelection');
            //$("#jqGrid").jqGrid('setSelection',$("#selRow").val(),false);
            $("#jqGrid").jqGrid('setSelection',rowid);

            vm.openInfoLayer($("#jqGrid").jqGrid("getRowData", rowid));

            //$('#myTab a:first').tab('show');
        },
        gridComplete:function(){
        	//隐藏grid底部滚动条
        	//$("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "scroll" });
            var ids = $("#jqGrid").getDataIDs(), total_count = 0;
            for(var i = 0; i<ids.length; i++) {
                var rowData = $("#jqGrid").getRowData(ids[i]);
                total_count += (rowData.afterStatus == '正常' ? 1 : 0);
                if (rowData.afterStatus != '正常'){
                    $("#jqGrid").find('#' + ids[i]).find("td").addClass("errrow");
                }
            }

            $("#jqGrid").jqGrid("footerData", "set", {
                deviceId:"本页状态汇总",
                beforeDate:"正常：",
                afterDate:""+ total_count,

                beforeStatus:"故障：" ,
                afterStatus: ""+(ids.length-total_count)
            });

        }
    });


    $("#jqGridData").jqGrid({
        url: baseURL + 'waterself/prodatahistorysubself/list',
        datatype: "json",
        postData:{
            pro_name:vm.q.dept,
            clientId:vm.q.cid,
            nowDate:vm.date1,
            deviceId:vm.q.deviceId,
        },
        colModel: [
            { label: '设备号', name: 'deviceId', index: 'device_id', width: 100 },
            { label: '表卡编号', name: 'clientId', index: 'client_id', width: 80 },
            { label: '采集日期', name: 'nowDate', index: 'now_date', width: 100 },
            { label: '客户地址', name: 'clientAddress', index: 'client_address', width: 100 },
            { label: '备注2', name: 'memo2', index: 'memo2', width: 60},
            { label: '仪表状态', name: 'deviceStatus', index: 'device_status', width: 80 },
            { label: '采集数据', name: 'nowData', index: 'now_data', width: 60},

            { label: '设备地址', name: 'deviceAddress', index: 'device_address', width: 120 },
            { label: '客户姓名', name: 'clientName', index: 'client_name', width: 80 },
            { label: '仪表类型', name: 'typeName', index: 'type_name', width: 100 },
            //{ label: '状态码', name: 'statusCode', index: 'status_code', width: 40 },

            { label: 'IMEI', name: 'imei', index: 'imei', width: 60,hidden:true},
            { label: '户号', name: 'hourseNum', index: 'hourse_num', width: 60,hidden:true},
            { label: '质保开始日期', name: 'warrantyStart', index: 'warranty_start', width: 60,hidden:false},
            { label: '现场记录', name: 'recordOnSpot', index: 'record_on_spot', width: 60,hidden:false},
            { label: '唯一码', name: 'unkey', index: 'unkey', width: 80, key: true,hidden:true},

            { label: '备注', name: 'memo1', index: 'memo1', width: 60,hidden:true }
        ],
        viewrecords: true,
        height: $(window).height() > 385 ?  $(window).height() - 200 : 385,
        rowNum: 30,
        rowList : [10,30,50,100],
        rownumbers: true,
        rownumWidth: 55,
        autowidth:true,
        shrinkToFit:true,
        pager: "#jqGridPagerData",
        jsonReader : {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        prmNames : {
            page:"page",
            rows:"limit",
            order: "order"
        },
        ondblClickRow: function(rowid, iRow, iCol, e){

        },
        gridComplete:function(){
           // $("#jqGridData").setGridWidth($(window).width()*0.8);
            const resizeEvent = new Event('resize');
            window.dispatchEvent(resizeEvent);
        }
    });

});

var vm = new Vue({
	el:'#rrapp',
	data:{
        q:{
            cid:null,
            cname:null,
            date1:'',
            date2:'',
            dept:null,
            ftype:'C00',
            deviceid:'',
            clientaddr:'',
            fstatus:'0',
            plateno:null,
            stampno:null,
        },
        newpage : false,
		showList: true,
		title: null,
		proDataAnalyse: {},
        dataDate:{}
	},
	methods: {
        getDataDate: function(){
            vm.q.date1 = '';
            vm.q.date2 = '';

            $.get(baseURL + "waterself/prodataanalysesubself/listdate",{proName:''}, function(r){
                vm.dataDate = r.page;
                //console.log(vm.dataDate);
                if(vm.dataDate.length > 0){
                    vm.q.date1 = vm.dataDate[0];
                    vm.q.date2 = vm.dataDate[0];
                    
                    vm.query();
                }
            });
        },
        initData:function (){
            vm.q.cid = null;
            vm.q.cname = null;
            vm.q.deviceid = null;
            vm.q.clientaddr = null;
            vm.q.fstatus = '0';
            vm.q.ftype='C00';
            vm.q.plateno=null;
            vm.q.stampno=null;
            vm.q.date1 = vm.dataDate.length > 0 ? vm.dataDate[0] : '';
            vm.q.date2 = vm.dataDate.length > 0 ? vm.dataDate[0] : '';

            vm.query();
        },
        query: function () {
            vm.newpage=true;
            vm.reload();
        },
		getInfo: function(clientId){
			$.get(baseURL + "waterself/prodataanalysesubself/info/"+clientId, function(r){
                vm.proDataAnalyse = r.proDataAnalyse;
            });
		},
        outxls: function(){
            var total = $("#jqGrid").jqGrid('getGridParam', 'records') + "";
            var dept = vm.q.dept==null ? "" : vm.q.dept+  "";
            var url = baseURL
                + "waterself/prodataanalysesubself/export?params="
                + encodeURIComponent(JSON.stringify(
                    {
                        proName:vm.q.dept,
                        beforeDate:vm.q.date1,
                        afterDate:vm.q.date2,
                        clientName:vm.q.cname,
                        clientId:vm.q.cid,
                        ftype:vm.q.ftype,
                        deviceid:vm.q.deviceid,
                        clientaddr:vm.q.clientaddr,
                        fstatus:vm.q.fstatus,
                        plateno:vm.q.plateno,
                        stampno:vm.q.stampno,
                        limit:total,
                        page:"1"
                    }));

            //console.log(decodeURIComponent(url));
            location.href = url;
        },
        openInfoLayer :function(event){
            vm.proDataAnalyse = event;
            //console.log(event);
            $("#jqGridData").jqGrid('setGridParam',{
                postData:{
                    'pro_name':event.proName,
                    'clientId':event.clientId,
                    'deviceId':event.deviceId,
                    'nowDate':vm.q.date1,
                },
                page:1
            }).trigger("reloadGrid");

            layer.open({
                type: 1,
                offset: '50px',
                skin: 'layui-layer-molv',
                title: "采集日期【"+ vm.q.date1 +"】后【"+event.proName+"】【"+event.clientName + "】【" +event.clientAddress+"】数据记录",
                area: ['90%', '600px'],
                shade: 0,
                shadeClose: false,
                content: jQuery("#infoLayer"),
                btn: ['确定'],
            });
        },
		reload: function (event) {
			vm.showList = true;
			var page = $("#jqGrid").jqGrid('getGridParam','page');
            if(vm.newpage){page = "1";}
			$("#jqGrid").jqGrid('setGridParam',{
                postData:{
                    'proName':vm.q.dept,
                    'beforeDate':vm.q.date1,
                    'afterDate':vm.q.date2,
                    'clientName':vm.q.cname,
                    'clientId':vm.q.cid,
                    'ftype':vm.q.ftype,
                    'deviceid':vm.q.deviceid,
                    'clientaddr':vm.q.clientaddr,
                    'fstatus':vm.q.fstatus,
                    'plateno':vm.q.plateno,
                    'stampno':vm.q.stampno,
                },
                page:page
            }).trigger("reloadGrid");
		}
	},
    created: function(){
        //this.getDataDate();
    },
    mounted: function(){

    }
});